<template>
	<wd-toast />
	<BpmComponent :processInstanceId="processInstanceId" @success="refreshDetail">
		<template #approval-info>
			<up-form labelPosition="left" labelWidth="120" v-if="Object.keys(formData).length > 0">
				<up-form-item v-for="field in formFields" :key="field.key" :label="field.label" borderBottom>
					<!-- 修改正文字段显示方式 -->
					<text v-if="field.isDocument && formData[field.key]" class="file-link"
						@click="previewFile(formData[field.key])">
						{{ getFileName(formData[field.name]) || '无' }}
					</text>
					<text v-else>
						{{ field.format ? field.format(formData[field.key]) : formData[field.key] || '无' }}
						<!-- {{ formData[field.key] }} -->
					</text>
				</up-form-item>
			</up-form>
		</template>
	</BpmComponent>
</template>

<script setup lang="ts">
import { onLoad } from "@dcloudio/uni-app";
import { ref, unref, reactive, nextTick, getCurrentInstance } from 'vue'
import { DICT_TYPE, getDictLabel } from '@/utils/dict'
import BpmComponent from '@/components/processInstance/detail/index.vue'
import * as Meeting from '@/api/oa/meeting'
import { useMessage, useToast } from 'wot-design-uni'
import { formatDate } from '@/utils/formatTime'
import { getFileName, parseArrayField, previewFile } from '@/utils/fileUtils'

const message = useMessage()
const toast = useToast()

const processInstanceId = ref(null)// 流程实例的编号
const detailId = ref(null)
const formData = ref<any>({} as any)
const sealList = ref<any[]>([]) // 印章列表
//子表单数据
const requisitionDetails = ref<any[]>([])

const formFields = [
	{ label: '会议名称', key: 'meetName' },
	{ label: '会议室', key: 'mrName' },
	{ label: '会议室地点', key: 'mrAddress' },
	{ label: '会议开始时间', key: 'beginTime', format: formatDate },
	{ label: '会议结束时间', key: 'endTime', format: formatDate },
	{ label: '是否需要媒体', key: 'isNeedMedia', format: (val: number) => (val === 1 ? '是' : '否') },
	{ label: '是否需要桌签', key: 'isPrintDeskTag', format: (val: number) => (val === 1 ? '是' : '否') },
	{ label: '桌签附件', key: 'deskTagAttachments', isDocument: true, name: 'ename' },

	{ label: '会议描述', key: 'meetDesc' },
	// { label: '会议状态', key: 'status', isDict: true, dictType: DICT_TYPE.OA_METTING_STATUS }

]

onLoad(async (options) => {
	processInstanceId.value = options?.processInstanceId
	detailId.value = options?.id
	/** 获得详情 */
	getDetailById()
})
const refreshDetail = () => {
	console.log('父组件收到刷新事件，重新加载数据')
	getDetailById() // 调用父组件自己的获取详情方法
}
/** 获取页面详情 */
const getDetailById = async () => {
	try {
		const data = await Meeting.getMeeting(Number(detailId.value))
		formData.value = data
			console.log('formData.value',formData.value);
		
		if (formData.value.deskTagAttachments) {
			formData.value.ename = formData.value.deskTagAttachments.split('/').pop() || '附件'
		}
		console.log('formData.value',formData.value);
		
	} catch (error) {
		console.log('加载数据失败')
	}
}
</script>

<style>
/* 样式 */
/* 新增文件链接样式 */
.file-link {
	color: #007AFF;
	text-decoration: underline;
	cursor: pointer;
}

.uv-node {
	height: 34rpx;
	width: 34rpx;
	border-radius: 50%;
	background-color: #ddd;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	flex-shrink: 0;
	z-index: -1;
}

.audit-node {
	margin: 5px 0;
}
</style>